<template>
	<div class="wrap">
      <v-carousel :list="list" :wpTitle="carTitle"></v-carousel>
      <div class="team">
         <div class="subTile">
            <p>{{ teams.title }}</p>
            <span>{{ teams.subTitle }}</span>
         </div>
         <div class="team_box">
            <ul>
               <li v-for="item in teams.list">
                  <img :src="apiurl+item.picture" />
                  <div class="team_desc" v-html="item.content"></div>
               </li>
            </ul>
         </div>
      </div>
	</div>
</template>

<script>
import vCarousel from './components/carousel'
export default {
   data() {
   	return {
         teams: {
            title: '',
            subTitle: '',
            list: {
               picture: '',
               content: ''
            }
         },
         list: [],
         carTitle: 'TEAM'
   	}
	},
   components: {
      vCarousel
   },
   mounted (){
      let _this = this;

      // ajax获取数据
      this.ajax('?c=msg&ts=ABOUT US&wxapp_skin=', function (res){
         _this.teams.list = res.data.data2.rslist;
         _this.teams.title = res.data.data2.me.cate_name;
         _this.carTitle = res.data.data2.me.cate_name;
         _this.teams.subTitle = res.data.data2.me.subcate;
         _this.list = _this.$store.getters.getCar;
      });
 
   }
}
</script>

<style scoped>
   .team .subTile{margin: 0.2rem auto; text-align: center;}
   .team .subTile p{font-size: 0.16rem;}
   .team .subTile span:after{display: block; content: ''; height:0.02rem; width:0.4rem; background: #002665; margin:0.04rem auto 0;}
   .team .team_box{padding:0 .1rem;}
   .team .team_box li{margin-bottom: 0.1rem; overflow: hidden;}
   .team .team_box img{width:45%; float: left;}
   .team .team_box .team_desc{width:53%; float: left; margin-left:2%;}
   .team .team_box .team_desc p{font-size: .12rem !important;}
</style>